<template>
  <view @click.stop="handleDetail()" class="w-full  bg-white rounded-md box-shadow text-#1C213E py-2">
    <view v-if="isCode" class="w-full text-14px pt-4 pb-1 pl-3 flex items-center justify-start">
      <view> {{ data.typeName }}单号</view>
      <view class="ml-3">{{ data.orderNo }}</view>
    </view>
    <view class="flex items-center justify-center px-3">
      <view class="relative text-right">
        <image :src="data.goodsUrl || $getImageUrl('no_picture.png')" mode="aspectFit" class="rounded-md w-180 h-180"  @error="$getImageUrl('no_picture.png')" />
      </view>
      <view class="flex-1 !pl-3">
        <view class="w-full text-16px grid grid-cols-5">
          <view class="col-span-4 text-left">{{ data.name }}</view>
          <view class="col-span-1 text-right" @click.stop="handleTraceability()"><u-icon v-if="isNext" name="arrow-right" class="text-#1C213E" /></view>
        </view>
        <template v-if="data.propertyValueDetail.length > 0">
          <view v-for="(item, index) in data.propertyValueDetail" :key="index" class="w-full text-#7D8792 text-14px my-1">
            {{ item.propertyName }}：{{ item.valueName}}
          </view>
        </template>
        <view class="w-full text-#7D8792 text-14px my-1">数量：{{ data.goodsCount || 0 }}</view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts" name="OrdersItem">
import { onReady } from '@dcloudio/uni-app'
import { req } from '@/api/req'

const props = withDefaults(defineProps<{
  data?: any,
  isNext: boolean,
  isCode: boolean,
}>(), {
  data: () => {}, // 默认值为 null
  isNext: true,
  isCode: false,
})

const emits = defineEmits<{
  (event: 'change', value: string): void
}>()

/**
 * 详情
 */
async function handleDetail() {
  /*
  await uni.navigateTo({
    url: `/pages/workbench/workOrder/detail?id=${props.data?.goodsId}`,
  })
    */
}

async function handleTraceability() {
  if (props.isNext) {
    await uni.navigateTo({
      url: `/pages/workbench/wareHouse/traceability?goodsId=${props.data?.goodsId}`,
    })
  }
}

</script>
